<template>
  <el-select
    v-model="selected"
    placeholder="请选择学年"
    clearable
    @change="onchange"
  >
    <el-option
      v-for="item in items"
      :key="item.id"
      :label="item.name"
      :value="item.id"
    >
    </el-option>
  </el-select>
</template>

<script>
import moment from "moment";

export default {
  props: {
    value: {
      type: Number | null,
      default: null,
    },
  },

  watch: {
    value() {
      this.selected = this.value;
    },
  },

  data() {
    return {
      items: [],
      selected: this.value,
    };
  },

  methods: {
    init() {
      const curDate = new Date();
      const year = curDate.getFullYear();

      for (let i = 0; i < 7; i++) {
        this.items.push({ id: year + i, name: year + i });
      }

      console.log("year", this.items);
    },

    onchange(value) {
      this.$emit("input", value);
    },
  },

  mounted() {
    this.init();
  },
};
</script>

<style>
</style>